<!DOCTYPE html>  
<html>  
<head>  
<title>HTML5</title>  
<meta charset="utf-8" />  
<script src="/static/common/js/jquery.min.js"></script>
<body>
 
       <!-- <a href="javascipt:" class="send">发送</a>  -->
 
</body>
<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>  
<script>  
 
// $('.send').click(function(){
//     $.ajax({
//         type: 'POST',
//         url: "{:url('index/index/send')}",
//         data: {'id':1},
//         dataType: 'json',
//         success: function (data) {
//             if (data.status == 1) {
//                 alert('发送成功')
//                 // layer.msg(data.msg, { icon: 1, time: 1000 },function(){
//                 //     // parent.layer.close(index);
//                 //     window.location.reload()
//                 //     // parent.location.reload();
//                 // });
//             } else {
//                 alert('发送失败')
//                 // layer.msg(data.msg, { icon: 2, time: 1000 });
//             }
//         },
//         error: function () {
//             // layer.alert("服务器繁忙, 请联系管理员!");
//         },
//     });    
// })
 
$(function() {      
    var socket;  
    var readyState = ["connecting", "connected", "closing", "closed"];  
    /* 打开连接事件 */  
    $("button:eq(0)").click(function() {  
        try {  
             /* 连接 */  
            //  socket = new WebSocket("ws://39.96.9.241:6789");  
             socket = new WebSocket("ws://192.168.0.104:2346");
             /* 绑定事件 */  
             socket.onopen = function() {  
                 $("#msg").html("连接成功...");  
             };  
               
            socket.onmessage = function(e) {  
                 $("#msg").html($("#msg").html() + "<br />" + e.data);  
             };  
               
             socket.onclose = function() {  
                 $("#msg").html($("#msg").html() + "<br />关闭连接...");  
             };  
        } catch(exception) {  
            $("#msg").html($("#msg").html() + "<br />有错误发生");  
        }  
    });  
      
    /* 发送数据事件 */  
    $("button:eq(1)").click(function() {  
        /* 检查文本框是否为空 */  
        if($("#data").val() == "") {  
            alert("请输入数据！");  
            return;  
        }  
          
        try {  
            socket.send($("#data").val());  
            $("#msg").html($("#msg").html() + "<br />发送数据：" + $("#data").val());  
        } catch (exception) {  
            $("#msg").html($("#msg").html() + "<br />发送数据出错");  
        }  
          
        /* 清空文本框 */  
        $("#data").val("");  
    });  
      
    /* 断开连接 */  
    $("button:eq(2)").click(function() {  
        socket.close();  
    });  
});  
</script>  
</head>  
  
<body>  
<h1>WebSocket示例</h1>  
<input type="text" id="data" />  
<button>打开连接</button>  
<button>发送数据</button>  
<button>关闭连接</button>  
<p id="msg"></p>  
</body>  
</html>